<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<link href="css/birth.css" rel="stylesheet" />
	</head>

	<body>


		<div id="app">


			<header class="mui-bar mui-bar-nav">
				<h1 class="mui-title">第一章:牛马降世(需求分析版)</h1>
			</header>


			<div class="mui-content">

				<div class="container">
					<!-- 可以在这里添加其他内容 -->
					<!-- <h1>欢迎来到我的页面</h1> -->
					<p id="text">{{text}}</p>
				</div>


				<div v-show="start_btn_show">
					<button type="button" class="mui-btn mui-btn-grey mui-btn-outlined mui-btn-block"
						@click="select(1)">上等牛马(易)赚到100万平时分加2分</button>
					<button type="button" class="mui-btn mui-btn-grey mui-btn-outlined mui-btn-block"
						@click="select(2)">中等牛马(中)赚到100万平时分加4分</button>
					<button type="button" class="mui-btn mui-btn-grey mui-btn-outlined mui-btn-block"
						@click="select(3)">下等牛马(难)赚到100万平时分加6分</button>
				</div>


			</div>


		</div>











		<script src="js/util.js"></script>
		<script src="js/db.js"></script>
		<script src="js/mui.js"></script>
		<script src="js/vue-min.js"></script>
		<script type="text/javascript">
			mui.init()


			var app = new Vue({
				el: '#app',
				data: {
					text: '',
					start_btn_show: false
				},
				methods: {
					kaichangbai() {
						const container = document.getElementById('text');
						container.innerHTML = "";

						// const text = '按F12调整窗口显示大小！按F12调整窗口显示大小！按F12调整窗口显示大小！复习资料在游戏中！复习资料在游戏中！复习资料在游戏中！随着“哇”的一声，小牛马呱呱坠地，伴随着一阵奶香味，开启了他悲惨的一生！小牛马从小就注定了要与众不同：一出生就被误认为是“牛头马面”，整天遭受村民们的戏谑和调侃。然而，命运的捉弄并没有就此结束，反而才刚刚开始。但别担心！虽然命运对他不公，但通过你的智慧可以帮助小牛马打破屌丝的枷锁，迎接属于他的逆袭人生！笑声与挑战并存，快来一起加入这个疯狂的冒险吧！'; // 要显示的文本
						const text = 'test'
						let that = this
						setTimeout(function() {
							that.start_btn_show = true
						}, 100 * (text.length + 10))
						// 清空容器内容
						typeWriter(text, container, 100); // 调用逐字显示方法，速度设置为200毫秒14444557777


					},
					select(level) {
						switch (level) {
							case 1:
								mui.confirm('你选中了上等牛马，智力高，体力好，运气好！！！', '恭喜恭喜', ['确定了', '反悔了'], function(e) {
									// console.log(e.index)
									// return
									if (e.index == 0) {
										Database.saveData('niumaLevel', 1)
										document.location.href = 'createNiumaInfo.html'
									} else {
										
									}

								}, 'div')
								break;
							case 2:
								mui.confirm('你选中了中等牛马，智力一般，体力一般，运气一般！！！', '祝你好运', ['确定了', '再想想'], function(e) {
									if (e.index == 0) {
										Database.saveData('niumaLevel', 2)
										document.location.href = 'createNiumaInfo.html'
									}else{
										
									}

								}, 'div')

								break;
							case 3:
								mui.confirm('你选中了下等牛马 牛马中的战斗机 智商低 运气差 身体还不好', '佩服佩服', ['干就完了', '认怂'], function(e) {
									if (e.index == 0) {
										Database.saveData('niumaLevel', 3)
										document.location.href = 'createNiumaInfo.html'
									}else{
										
									}

								}, 'div')
								break;
							default:
								break;
						}
					}
				},
				mounted() {
					this.kaichangbai()

				}
			})
		</script>
	</body>

</html>